<!DOCTYPE html><html><head><title>Sencha Documentation Project</title><link rel="stylesheet" href="../reset.css" type="text/css"><link rel="stylesheet" href="../prettify.css" type="text/css"><link rel="stylesheet" href="../prettify_sa.css" type="text/css"><script type="text/javascript" src="../prettify.js"></script></head><body onload="prettyPrint()"><pre class="prettyprint"><pre><span id='Ext-layout.container.Absolute'>/**
</span> * @class Ext.layout.container.Absolute
 * @extends Ext.layout.container.Anchor
 * &lt;p&gt;This is a layout that inherits the anchoring of &lt;b&gt;{@link Ext.layout.container.Anchor}&lt;/b&gt; and adds the
 * ability for x/y positioning using the standard x and y component config options.&lt;/p&gt;
 * &lt;p&gt;This class is intended to be extended or created via the &lt;tt&gt;&lt;b&gt;{@link Ext.container.Container#layout layout}&lt;/b&gt;&lt;/tt&gt;
 * configuration property.  See &lt;tt&gt;&lt;b&gt;{@link Ext.container.Container#layout}&lt;/b&gt;&lt;/tt&gt; for additional details.&lt;/p&gt;
 * {@img Ext.layout.container.Absolute/Ext.layout.container.Absolute.png Ext.layout.container.Absolute container layout}
 * &lt;p&gt;Example usage:&lt;/p&gt;
 * &lt;pre&gt;&lt;code&gt;
Ext.create('Ext.form.Panel', {
    title: 'Absolute Layout',
    width: 300,
    height: 275,
    layout:'absolute',
    layoutConfig: {
        // layout-specific configs go here
        //itemCls: 'x-abs-layout-item',
    },
    url:'save-form.php',
    defaultType: 'textfield',
    items: [{
        x: 10,
        y: 10,
        xtype:'label',
        text: 'Send To:'
    },{
        x: 80,
        y: 10,
        name: 'to',
        anchor:'90%'  // anchor width by percentage
    },{
        x: 10,
        y: 40,
        xtype:'label',
        text: 'Subject:'
    },{
        x: 80,
        y: 40,
        name: 'subject',
        anchor: '90%'  // anchor width by percentage
    },{
        x:0,
        y: 80,
        xtype: 'textareafield',
        name: 'msg',
        anchor: '100% 100%'  // anchor width and height
    }],
    renderTo: Ext.getBody()
});
&lt;/code&gt;&lt;/pre&gt;
 */

Ext.define('Ext.layout.container.Absolute', {

    /* Begin Definitions */

    alias: 'layout.absolute',
    extend: 'Ext.layout.container.Anchor',
    requires: ['Ext.chart.axis.Axis', 'Ext.fx.Anim'],
    alternateClassName: 'Ext.layout.AbsoluteLayout',

    /* End Definitions */

    itemCls: Ext.baseCSSPrefix + 'abs-layout-item',

    type: 'absolute',

    onLayout: function() {
        var me = this,
            target = me.getTarget(),
            targetIsBody = target.dom === document.body;

        // Do not set position: relative; when the absolute layout target is the body
        if (!targetIsBody) {
            target.position();
        }
        me.paddingLeft = target.getPadding('l');
        me.paddingTop = target.getPadding('t');
        me.callParent(arguments);
    },

    // private
    adjustWidthAnchor: function(value, comp) {
        //return value ? value - comp.getPosition(true)[0] + this.paddingLeft: value;
        return value ? value - comp.getPosition(true)[0] : value;
    },

    // private
    adjustHeightAnchor: function(value, comp) {
        //return value ? value - comp.getPosition(true)[1] + this.paddingTop: value;
        return value ? value - comp.getPosition(true)[1] : value;
    }
});</pre></pre></body></html>